﻿<style type="text/css">
    .CodeMirror {    
        border: 1px solid #eee;    
        height: 160px;
        
        }
    .CodeMirror-code{
        font-size:24pt;
    }
</style>
<div id="ui_progexercise_layout" class="easyui-layout" data-options="fit:true,border:false">
    <div data-options="region:'west',split:true,title:'试题描述'" style="width: 250px; padding: 5px;">
        
	    <div id="ui_prog_question" class="easyui-datalist" style="width:235px;"></div>
	</div>
	<div data-options="region:'center',border:false" >
	    <div class="easyui-layout" style="height:100%; background-color: #F0F0F0;">
	        <div style="height:250px;padding:5px" data-options="region:'north',split:true,title:'试题内容'">                
				<div id="div_question_title"  ></div>
			</div>				
			<div data-options="region:'center',split:true">
				<div class="easyui-layout" style="height:100%; background-color: #F0F0F0;">
					<div data-options="region:'center',title:'答案提交',border:false" style="height: 100%"> 
						<table style="width:100%">
							<tr>
								<td>
                                    <div id="error_msg" style="color:red"></div>
									<textarea id="progcode" name="progcode"></textarea>									
								</td>
								<td style="width:80px;vertical-align:central;" >
									<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-save'" onclick="submitAnswer();">提交</a>       
					        
								</td>
							</tr>
						</table>
					</div>					
				</div>
			</div>	
							
		</div>
	</div>
</div>
       
<script>
	var currentQuestion;

	$(function () {
	    var mime = 'text/x-sql';
	    // get mime type
	    if (window.location.href.indexOf('mime=') > -1) {
	        mime = window.location.href.substr(window.location.href.indexOf('mime=') + 5);
	    }
	    window.progeditor = CodeMirror.fromTextArea(document.getElementById('progcode'), {
	        mode: mime,
	        indentWithTabs: true,
	        smartIndent: true,
	        lineNumbers: true,
	        matchBrackets: true,
	        autofocus: true,

	        extraKeys: { "Alt-/": "autocomplete" },
	        viewportMargin: Infinity,
	        hintOptions: {
	            
	        }
	    });
	    
	    $("#ui_prog_question").datalist({       //初始化datagrid
	        url: "ashx/rm_progexercise.ashx?action=getall",
	        valueField: 'id',
	        textField: 'title',
	        method: 'get',
	        textFormatter: function (value, row, index) {
	            var v = '[<font color="green">' + row['status'] + '</font>]  ';
	            var t = $('<div>' + value + '</div>').text();
	            return v + (index+1)+'. '+(t.length > 15 ? t.substring(0, 15) : t);
	        },
	        onSelect: function (rowIndex, rowData) {
	            currentQuestion = rowData;
	            var title = rowData['title'];
	            var x = title.indexOf(']')+1;
	            var title = title.substring(x, title.length);
	            title  = "<div style='color:blue;font-size:14px'>" + title + "</div>";
	            title += "<div style='color:blue;font-size:14px'>" + rowData['remark'] + "</div>";
	            $('#div_question_title').html(title);	            
	            $('#error_msg').text('');	            
	        }
	    });
	});

	function submitAnswer() {
	    var t = window.progeditor.getValue();
	    t = $.trim(t);
	    if (!t || t.length == 0) {
	        alert("请输入答案！");
	        return;
	    }	    
	    if (!currentQuestion || currentQuestion['id'].length == 0) {
	        alert("请选择题目");
	        return;
	    }

	    var fdStart = t.toUpperCase().indexOf("SELECT");
	    if (fdStart != 0) {
	        alert("SQL语句必须以SELECT开头!");
	        return;
	    }

	    $.ajax({
	        url: 'ashx/rm_progexercise.ashx?action=answer',
	        data: {
	            questionId: currentQuestion['id'],
	            answer: t,
                tt:new Date().getTime()
	        },
	        type: 'POST',
	        dataType: 'json',
	        success: function (data) {
	            if (data.success) {
	                var qa = JSON.parse(data.msg)
	                $('#error_msg').text(qa.statusStr);
	                if (qa.status == 1 || qa.status == 3) {
	                    createTable(qa.jsonAnswer);
	                    createTableRefAnswer(qa.jsonRefAnswer);
	                    if (qa.status == 1) {
	                        //$("#ui_sql_question").datalist("reload");
	                        var rows = $("#ui_sql_question").datalist("getRows");	                        
	                        for (var i = 0; i < rows.length; i++) {
	                            if (rows[i].id == currentQuestion.id) {
	                                rows[i].status = "Yes";
	                                $("#ui_sql_question").datalist("loadData", rows);
	                                break;
	                            }
	                        }
	                    }
	                } else if (qa.status == 2) {
	                    createTableRefAnswer(qa.jsonRefAnswer);
	                }
	            } else {
	                alert("操作出错!");
	            }
	        }
	    });
	}	
</script>
